<template>
    <div>
        <el-card shadow="never">
            <vxe-grid ref='xGrid' v-bind="gridOptions" v-on="gridEvent">
                <template #logslot="{ row }">
                    <el-popover placement="top-start" :width="150" :height="150" trigger="hover">
                        <el-image style="width: 120px; height: 120px" :src="row.avatarUrl" fit="cover" />
                        <template #reference>
                            <el-image style="width: 36px; height: 36px" :src="row.avatarUrl" fit="cover" />
                        </template>
                    </el-popover>
                </template>
                <template #parentIDslot="{ row }">
                    {{ row.parent ? row.parent.id : "" }}
                </template>
                <template #parentMobileslot="{ row }">
                    {{ row.parent ? row.parent.mobile : "" }}
                </template>
                <template #parentslot="{ row }">
                    <div class="text-sm text-blue-500 cursor-pointer"
                        @click="toRewardShow(row.parent ? row.parent.id : null)">
                        {{ row.parent ? row.parent.name : "" }}
                    </div>
                </template>
                <template #action="{ row }">
                    <el-popconfirm title="确定确认奖励?" v-if="row.parent && row.is_reward == 0" @confirm="confirmReward(row)">
                        <template #reference>
                            <el-button type="danger" plain>奖励推荐人</el-button>
                        </template>
                    </el-popconfirm>
                </template>
            </vxe-grid>
        </el-card>
    </div>
</template>

<script setup lang="ts">
import { http } from '@/plugins/axios'
import router from '@/plugins/router'

import { ElMessageBox } from 'element-plus'
const { gridOptions } = useReward();
const gridEvent: VxeGridListeners<RowVO> = {
    proxyQuery() {
        console.log('数据代理查询事件')
    },
    proxyDelete() {
        console.log('数据代理删除事件')
    },
    proxySave() {
        console.log('数据代理保存事件')
    }
}
const xGrid = ref()
const toRewardShow = (id) => {
    router.push({ path: `/member/${id}/rewardshow` })
}
const confirmReward = async (row: any) => {
    // 创建一个奖励订单
    await http.request({
        url: "order",
        method: "post",
        data: {
            subject: `推荐人：${row.parent.id}|被推荐人：${row.id}`,
            price: 5,
            state: 2,
            way: "reward"
        }
    })
    // 更新当前用户被奖励状态
    await http.request({
        url: `user/${row.id}/Updatereward`,
        method: "get",
    })
    xGrid.value.commitProxy('reload')
}
</script>

<style scoped></style>